import { Component } from '@angular/core';
import {IonicPage, ModalController, NavController, NavParams} from 'ionic-angular';
import {HttpService} from "../../providers/HttpService";
import {SocketService} from "../../providers/SocketService";

/**
 * Generated class for the QuotationPage page.
 *
 * See http://ionicframework.com/docs/components/#navigation for more info
 * on Ionic pages and navigation.
 */
@IonicPage()
@Component({
  selector: 'page-quotation',
  templateUrl: 'quotation.html',
})
export class QuotationPage {

    index_items: any[] = [];
    tab_position: number = 0;
    tab_list: any[] = [
        /*{
            title: '自选',
            value: null
        },*/
        {
            title: '贵金属',
            value: 'gjs'
        },
        {
            title: '外汇',
            value: 'wh'
        },
        {
            title: '股指',
            value: 'gz'
        },
        {
            title: '原油',
            value: 'yy'
        },
    ];

    prevStyleIndex = -1;
    price_style_list: Array<any> = [];

    quotation_list: Array<any> = [];

    constructor(public navCtrl: NavController, public navParams: NavParams,
                private modalCtrl: ModalController,
                private httpService: HttpService,
                private socketService: SocketService) {
    }

    ionViewWillLoad() {
        this.socketService.listenRemoteServer((key, data) => {
            for (let i = 0; i < this.quotation_list.length; i++) {
                let quotation = this.quotation_list[i];
                if (quotation.key == key) {
                    console.log('quotationPushH5 index:', i);
                    console.log('quotationPushH5 name:', quotation.name);
                    console.log('quotationPushH5 data:', data);
                    this.updatePriceStyle(i, data);
                }
            }
        });
    }

    ionViewDidLoad() {
        this.getQuotation(this.tab_list[0].value).then(result => {
            this.quotation_list = result;
        });
    }

    getTabBtnStyle(index: number) {
        return {
            'tab-btn-select': this.tab_position == index,
            'tab-btn-none': this.tab_position != index
        };
    }

    getPriceStyle(index: number) {
        this.price_style_list.push({});
        return this.price_style_list[index];
    }

    updatePriceStyle(index: number, data: Array<any>) {
        this.quotation_list[index].tradePrice = data[0];
        this.quotation_list[index].range = data[5];
        this.quotation_list[index].rangePercent = data[6];
        let value = Number(data[5]);
        this.price_style_list[index] = {
            'normal-price-update': value == 0,
            'up-price-update': value > 0,
            'down-price-update': value < 0
        };
        if (this.prevStyleIndex >= 0) {
            this.price_style_list[this.prevStyleIndex] = {};
        }
        this.prevStyleIndex = index;
    }

    getRangeStyle(range: string) {
        let value = Number(range);
        return {
            'normal-range': value == 0,
            'up-range': value > 0,
            'down-range': value < 0
        };
    }

    getQuotation(type: string): Promise<any> {
        return new Promise(resolve => {
            this.httpService.instance()
                .setUrl('/gold/getQuotation/v2')
                .setQuery({
                    type: type
                })
                .getRequest()
                .then(res => {
                    if (res.status == 0) {
                        resolve(res.data.result);
                    } else {
                        console.log(res.msg);
                    }
                });
        });
    }

    onTabBtnSelected(index: number, value: string) {
        this.tab_position = index;
        this.getQuotation(value).then(result => {
            this.quotation_list = result;
        });
    }

    onQuotationRefresh() {
        this.getQuotation(this.tab_list[this.tab_position].value).then(result => {
            this.quotation_list = result;
        });
    }

    onQuotationDetail(quotation: any) {
        this.navCtrl.push('QuotationDetailPage', {data: quotation});
    }

    onShowSelect() {
        let stockSelectModal = this.modalCtrl.create('StockSelectPage');
        stockSelectModal.onDidDismiss(data => {
            if (data) {
                this.index_items = [];
                for (let i = 0; i < data.custom.length; i++) {
                    if (data.custom[i].selected) {
                        this.index_items.push(data.custom[i]);
                    }
                }
                console.log(this.index_items);
            }
        });
        stockSelectModal.present();
    }
}
